body {
  padding: 0;
}
#app {
  position: absolute;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  & > :nth-child(1) {
    flex: 1;
    overflow: auto;
    padding: 8px;
    & > :nth-child(1) {
      display: flex;
      align-items: center;
      & > :nth-child(1) {
        flex: 1;
        display: flex;
        align-items: center;
        gap: 0.5em;
      }
    }
  }
  & > :nth-child(2) {
    border-top: 1px solid #777;
    padding: 5px;
    display: grid;
    grid-template:
      'vote pageShow pageControl'
      / auto 85px 150px;
    column-gap: 10px;
    align-items: center;
    & > .vote {
      grid-area: vote;
      display: flex;
      align-items: center;
    }
    & > .pageShow {
      grid-area: pageShow;
      text-align: right;
    }
    & > .pageControl {
      grid-area: pageControl;
      display: flex;
      gap: 10px;
      & > vscode-button {
        flex: 1;
      }
    }
    @media screen and (max-width: 350px) {
      grid-template:
        'vote pageShow'
        'pageControl pageControl'
        / auto 85px;
    }
  }
}
